<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0" name="viewport">
    <meta content="ie=edge" http-equiv="X-UA-Compatible">
    <script src="{$oss}/active/newyear/js/rem.js"></script>
    <title>生日祝福</title>
<!--    <script src="https://static.jmlk.co/scripts/dist/jmlink.min.js"></script>-->
    <style>
        * {
            margin: 0;
            padding: 0;
        }

        .content-box {
            width: 7.5rem;
            margin: 0 auto;
        }

        .content-box .content {
            width: 6.7rem;
            margin: 0 auto 1.5rem;
            box-shadow: 0.02rem 0.02rem 0.18rem 0 rgba(0, 0, 0, 0.2);
            border-radius: 0.2rem;
        }

        .box {
            position: relative;
            box-sizing: border-box;
            padding-top: 1.28rem;
        }

        .avatar {
            width: 1.06rem;
            height: 1.06rem;
            border-radius: 0.53rem;
            position: absolute;
            top: 0.69rem;
            left: 3.22rem;
        }

        .avatar-icon {
            width: 0.905rem;
            height: 0.817rem;
            background: url("{$oss}/web/static/birthday/wish_icon.png") no-repeat center center;
            background-size: 100%;
            position: absolute;
            left: 3.68rem;
            top: 0.19rem;
        }

        .nickname {
            width: 7.5rem;
            line-height: 0.4rem;
            font-size: 0.3rem;
            font-family: PingFangSC-Semibold, PingFang SC;
            font-weight: 600;
            color: rgba(51, 51, 51, 1);
            text-align: center;
            position: absolute;
            left: 0;
            top: 2.04rem;
        }

        .astro-data-txt {
            width: 7.5rem;
            text-align: center;
            font-size: 0.30rem;
            font-family: PingFangSC-Regular, PingFang SC;
            font-weight: 400;
            color: rgba(51, 51, 51, 1);
            line-height: 0.40rem;
            position: absolute;
            left: 0;
            top: 2.74rem;
        }

        .astro-desc {
            width: 7.5rem;
            text-align: center;
            font-size: 0.30rem;
            font-family: PingFangSC-Regular, PingFang SC;
            font-weight: 400;
            color: rgba(51, 51, 51, 1);
            line-height: 0.40rem;
            position: absolute;
            left: 0;
            top: 3.19rem;
        }

        .send-user {
            width: 7.5rem;
            height: 0.8rem;
            background: rgba(245, 245, 245, 1);
            box-sizing: border-box;
            padding-left: 1.34rem;
            line-height: 0.8rem;
            font-size: 0.24rem;
            font-family: PingFangSC-Regular, PingFang SC;
            font-weight: 400;
            color: rgba(153, 153, 153, 1);
            position: relative;
        }

        .send-avatar {
            width: 0.6rem;
            height: 0.6rem;
            position: absolute;
            left: 0.4rem;
            top: 0.1rem;
            z-index: 9999;
            border-radius: 0.3rem;
        }

        .bottom {
            width: 7.5rem;
            height: 1rem;
            position: fixed;
            z-index: 100000000;
            bottom: 0;
            color: #fff;
        }

        .shadow {
            width: 100%;
            height: 1rem;
            background: rgba(0, 0, 0, 0.5);
            position: absolute;
            left: 0;
            top: 0;
            z-index: 1;
        }

        .bo-left {
            width: 0.44rem;
            height: 0.44rem;
            line-height: 0.44rem;
            font-size: 0.3rem;
            display: block;
            float: left;
            position: relative;
            z-index: 2;
            text-align: center;
            border: 0.01rem solid #fff;
            border-radius: 50%;
            margin: 0.24rem 0.28rem 0.24rem 0.19rem;
        }

        .bo-logo {
            padding: 0.15rem 0;
            float: left;
            position: relative;
            z-index: 2;
        }

        .bo-logo img {
            width: 0.7rem;
            height: 0.7rem;
            border-radius: 0.05rem;
        }

        .bo-des {
            width: 5.8rem;
            height: 1rem;
            line-height: 1rem;
            float: left;
            position: relative;
            z-index: 2;
            padding-left: 0.28rem;
            box-sizing: border-box;
            font-size: 0.30rem;
            font-family: PingFangSC-Regular, PingFang SC;
            font-weight: 400;
            color: rgba(255, 255, 255, 1);
        }

        .bo-btn {
            float: right;
            height: 1rem;
            position: absolute;
            right: 0;
            z-index: 20;
            background: rgba(255, 108, 137, 1);
        }

        .bo-btn a {
            display: block;
            width: 1.7rem;
            height: 1rem;
            text-align: center;
            color: #fff;
            text-decoration: none;
            line-height: 1rem;
            font-size: 0.30rem;
            font-family: PingFangSC-Regular, PingFang SC;
            font-weight: 400;
            color: rgba(255, 255, 255, 1);
            outline: none;
        }

        .wish-info {
            box-sizing: border-box;
            min-height: 12.51rem;
            padding: 10.3rem 0.65rem 0.65rem;
            position: relative;
            z-index: 99999999;
            font-size: 0.3rem;
            color: rgba(51, 51, 51, 1);
        }

        pre {
            white-space: pre-wrap;
            white-space: -moz-pre-wrap;
            white-space: pre-wrap;
            white-space: -o-pre-wrap;
            word-wrap: break-word;
        }

        .astro-img {
            width: 6.7rem;
            position: absolute;
        }
    </style>
</head>
<body class="content-box">
<div class="send-user">
    <img class="send-avatar" src="{$oss}{$send_user.avatar}" alt="">好友“{$send_user.nickname}”为您定制了生日祝福～
</div>
<div class="box">
    <div class="content" style="background-color: {$astro_bg_color}">
        <img class="astro-img" src="{$oss}{$astro_img}" alt="">
        <div class="avatar-box">
            <img class="avatar" src="{$oss}{$avatar}" alt="">
            <div class="avatar-icon"></div>
        </div>
        <div class="nickname">{$nickname}</div>
        <div class="astro-data-txt">{$astro_data_text}</div>
        <div class="astro-desc">{$astro_desc}</div>
        <pre class="wish-info">{$wish_content}</pre>
    </div>
</div>
<div class="bottom" id="bottom">
    <div class="shadow"></div>
    <div class="bo-left" id="close">x</div>
    <div class="bo-logo">
        <img src="{$oss}/uploads/20180329/33503860a02a86f4c23d59ac75ec5b59.jpg" alt="">
    </div>
    <div class="bo-des">启动APP体验更多惊喜</div>
    <div class="bo-btn">
        <a href="javascript:;" id="btn">打开APP</a>
    </div>
</div>
</body>
<script src="{$oss}/active/seven/js/jquery-v2.1.1.min.js"></script>
<script type="text/javascript">
    // $(function () {
    //     new JMLink({
    //         jmlink: 'https://a0ue2y.jmlk.co/AA63',// 短链地址
    //         button: document.querySelector('a#btn'),
    //     });
    // })
    document.querySelector('a#btn').addEventListener('click', function (e) {
        window.location = 'https://applink-zhunle.goddessxzns.com?app=zhunle&target=local&link=empty';
    })
</script>
<script src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
<script language="javascript">
    var signPackage = JSON.parse('{:json_encode($signPackage)}');
    //微信分享 配置
    wx.config({
        debug: false,
        appId: signPackage.appId,
        timestamp: signPackage.timestamp,
        nonceStr: signPackage.nonceStr,
        signature: signPackage.signature,
        jsApiList: ['onMenuShareTimeline', 'onMenuShareAppMessage']
    })
    ;
    //微信分享 配置
    wx.ready(function () {
        wx.onMenuShareAppMessage({
            title: '亲爱的，祝你生日快乐',
            desc: '我准备了一份惊喜，一定要打开看看哟！',
            link: signPackage.url,
            imgUrl: '{$domain}/static/video_share/images/share_logo.png',
            type: 'link',
            dataUrl: '',
            success: function () {

            },
            cancel: function () {

            }
        });
        wx.onMenuShareTimeline({
            title: '亲爱的，祝你生日快乐',
            link: signPackage.url,
            imgUrl: '{$domain}/static/video_share/images/share_logo.png',
            success: function () {

            },
            cancel: function () {

            }
        });
    });
</script>
{include file="../apps/web/view/public/sensors.html" /}
<script>
    var cnzz_s_tag = document.createElement('script');
    cnzz_s_tag.type = 'text/javascript';
    cnzz_s_tag.async = true;
    cnzz_s_tag.charset = 'utf-8';
    cnzz_s_tag.src = 'https://w.cnzz.com/c.php?id=1279032886&async=1';
    var root_s = document.getElementsByTagName('script')[0];
    root_s.parentNode.insertBefore(cnzz_s_tag, root_s);
</script>
</html>
